<template>
  <div v-if="userProfile">
    <a-form-item label="用户头像">
      <div @click="visible = true">
        <Gallery type="avatar" @update="uploadFile" v-model="userProfile.avatar">
          <a-avatar :src="getImageByFullPath(`${userProfile.avatar}`)" alt="avatar" :size="84" />
        </Gallery>
      </div>
    </a-form-item>
  </div>
</template>

<script setup lang="ts">
import { getImageByFullPath } from '@/api/utils/image';
import Gallery from '@/views/selector/gallery/Gallery.vue';
import { userProfile } from '../profile/data';

const visible = ref(false);
const uploadFile = () => {
  visible.value = false;
};
</script>

<style lang="scss" scoped></style>
